{% extends "kjssoft/layouts/base.html" %}

{% load staticfiles %}

{% block mainstyles %}
    {{ block.super }}
    <style type="text/css">
        body {
            background-color:ghostwhite;
        }
        div.authWidget {
            width: 1022px;
            min-width: 1022px;
            max-width: 1022px;
            margin: 0 auto;
            border-left: 1px solid gainsboro;
            border-bottom: 1px solid gainsboro;
            border-right: 1px solid gainsboro;
            background-color:white;
        }
        div.authWidget >div.formWidget {
            width:392px;
            min-height:300px;
            margin-left:512px;
            padding:30px 60px;
        }
        div.authWidget >div.formWidget h2 {
            margin:0 0 20px 0;
        }
        div.authWidget >div.formWidget input[type="text"],
        div.authWidget >div.formWidget input[type="password"] {
            width:340px;
            height:26px;
            padding:5px 40px 5px 10px;
            margin:5px 0;
            border:1px solid gainsboro;
            outline:none;
        }
        div.authWidget >div.formWidget input[type="text"]:focus,
        div.authWidget >div.formWidget input[type="password"]:focus {
            border-color:deepskyblue;
        }
        div.authWidget >div.formWidget input[name="username"],
        div.authWidget >div.formWidget input[name="login-username"] {
            background: url("{% static 'images/one4.jpg' %}") no-repeat 360px 9px;
        }
        div.authWidget >div.formWidget input[name="password"],
        div.authWidget >div.formWidget input[name="login-password"],
        div.authWidget >div.formWidget input[name="password1"] {
            background: url("{% static 'images/one5.jpg' %}") no-repeat 360px 9px;
        }
        div.authWidget >div.formWidget ul.errorInfoWidget {
            margin:5px 0 0 10px;
            padding:0 0 20px 0;
        }
        div.authWidget >div.formWidget button {
            width:390px;
            border:1px solid gainsboro;
            height:36px;
            padding:5px 10px;
        }
    </style>
{% endblock %}

{% block layout_body %}
    <div class="authWidget">
        {% block form %}
            <div class="formWidget">
                <div>
                    {% block form_header %}
                        <h2>欢迎回来</h2>
                    {% endblock %}
                </div>
                <form action="{% block form_action %}{% endblock %}"
                      method="{% block form_method %}{{ method|default:"POST" }}{% endblock %}">
                    {% if not method or method == "post" or method == "POST" %}
                        {% csrf_token %}
                    {% endif %}
                    {% block form_body %}{% endblock %}
                    {% block form_body_extra %}
                        <button name="{% block form_action_name %}{% endblock %}" class="pure-button pure-button-primary">
                            {% block form_action_label %}{% endblock %}
                        </button>
                    {% endblock %}
                </form>
                {% block form_footer %}{% endblock %}
            </div>
        {% endblock %}
    </div>
{% endblock %}